<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Document</title>
    <style>
        .list {
            padding: 12px;
        }
    </style>
</head>

<body>
    <div id="ctn">
        <ul>
            <li>标题：<b></b>作者：<b></b>点击量：<b></b></li>
        </ul>
    </div>
    <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
    <script src="../js/template-web.js"></script>
    <script id="news" type="text/html">
        <ul>
            {{each data value i}}
            <!-- <li>索引 {{i + 1}} ：{{value}}</li> -->
            <li class='list'>[{{i + 1}}]===>标题：<b>{{value.title}}</b>作者：<b>{{value.content}}</b></li>
            {{/each}}
        </ul>
        <!-- {{$data}} -->
    </script>

    <script>
        function init() {
            $.post(
                "http://127.0.0.1/newslist", {

                },
                function(resp) {
                    console.log(resp);
                    document.getElementById("ctn").innerHTML = template(
                        "news",
                        resp
                    );
                    document.querySelector("#ctn").innerHTML = html;
                }
            );
        }
        init();

        var data = {
            title: "基本例子",
            isAdmin: true,
            list: ["文艺", "博客", "摄影", "电影", "民谣", "旅行", "吉他"]
        };
    </script>
</body>

</html>